const path = require("path");
module.exports = {
  // 相对路径
  entry: "./src/main.js",
  output: {
    // 文件名
    filename: "build.js",
    // 出口路径，绝对路径
    path: path.resolve(__dirname, "./build"),
  },
  module: {
    rules: [
      {
        test: /\.css$/i,
        // 先用css-loader处理为css，后用style-loader处理（从后往前）
        use: ["style-loader", {
          loader: "css-loader",
          options: {
            // 表示css语法遇见import的时候回去几步进行处理
            // 0 表示只用css-loader处理
            // 1 表示回退到postcss-loader处理后继续处理
            importLoaders: 1,
          }
        }, 'postcss-loader'],
      },
      {
        test: /\.less$/i,
        // 先用css-loader处理为css，后用style-loader处理（从后往前）
        use: ["style-loader", {
          loader: "css-loader",
          options: {
            // 表示css语法遇见import的时候回去几步进行处理
            // 0 表示只用css-loader处理
            // 1 表示回退到postcss-loader处理后继续处理
            importLoaders: 2,
          }
        }, 'postcss-loader', "less-loader"],
      },
      {
        test: /\.(png|jpg|gif|svg)$/i,
        // 先用css-loader处理为css，后用style-loader处理（从后往前）
        use: [{
          // url-loader配置和fil-loader类似
          // 解析后文件是base64编码嵌入js中不合理
          loader: "url-loader",
          options: {
            // [name]:文件名
            // [ext]:文件拓展名
            // [hash]:文件名md4算法hash值
            // [hash:<length>]:截取有限位hash
            // [path]:相对于webpack配置地址 
            // [contentHasg]:file-loader与[hash]一致
            // 添加导出文件夹img/
            name: 'img/[name].[hash:6].[ext]',
            // 添加导出文件夹
            // outputPath:'img'
            // 小于100kb打包为base64，大于的单独打包为文件
            limit: 100 * 1024
          }
        }],
      },
    ],
  },
};
